<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>约站</title>
    <meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" type="text/css" href="assets/css/reset.css"/>
    <link href="dist/css/sm.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="assets/css/iconfont.css"/>
    <link href="dist/css/sm-extend.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="assets/css/skin.css"/>
</head>
<body>
<div class="page-group">
    <!-- 单个page ,第一个.page默认被展示-->
    <div class="page">
        <!-- 工具栏 -->
        <nav class="bar bar-tab foot-nav">
            <a class="tab-item external active" href="#">
                <span class="icon iconfont icon-homefill"></span>
                <span class="tab-label">返回首页</span>
            </a>
            <a class="tab-item external" href="#">
                <span class="icon iconfont icon-selection"></span>
                <span class="tab-label">排行榜</span>
            </a>
            <a class="tab-item external" href="#">
                <span class="icon iconfont icon-friend"></span>
                <span class="tab-label">我的球队</span>
            </a>
            <a class="tab-item external" href="#">
                <span class="icon iconfont icon-my"></span>
                <span class="tab-label">个人中心</span>
            </a>
        </nav>
        <div class="content bg-white" data-distance="100">
            <div class="top-head">
                <img src="assets/images/head-top-logo.jpg">
            </div>
            <div class="cat-banner">
                <img src="assets/images/yz-banner.jpg">
                <div class="yz-btn"><img src="assets/images/yz-btn.png"></div>
            </div>
            <div class="ys-scroll">
                <div class="categroy-cnt" id="categroy-cnt">
                    <ul class="categroy-list" >

                        <li class="category-item selected">
                            <a href="javascript:void(0);">
                                长宁区
                            </a>
                        </li>
                        <li class="category-item">
                            <a href="javascript:void(0);">
                                长宁区
                            </a>
                        </li>
                        <li class="category-item">
                            <a href="javascript:void(0);">
                                长宁区
                            </a>
                        </li>
                        <li class="category-item">
                            <a href="javascript:void(0);">
                                长宁区
                            </a>
                        </li>
                        <li class="category-item">
                            <a href="javascript:void(0);">
                                长宁区
                            </a>
                        </li>
                        <li class="category-item">
                            <a href="javascript:void(0);">
                                长宁区
                            </a>
                        </li>
                        <li class="category-item">
                            <a href="javascript:void(0);">
                                长宁区
                            </a>
                        </li>


                    </ul>
                </div>
                <div class="categroy-rgt" id="categroy-rgt">
                    <ul class="list-ground ">
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                        <li>
                            <div>球场名称：<span>上海市第一中学</span></div>
                            <div>开放时间：8:30-17:30</div>
                        </li>
                    </ul>
                </div>
            </div>

        </div>
    </div>
</div>

</body>
</html>
<script type="text/javascript" src="assets/js/zepto.js"></script>
<script type="text/javascript" src="dist/js/sm.js"></script>
<script src="dist/js/sm-extend.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/config.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/common.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/iscroll.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    $(function(){
//        var height1=$(".top-head").height();
//        var height2=$(".cat-banner").height();
//        var height3=parseInt(height1)+parseInt(height2);
//        $(".ys-scroll").css({"top":height3});
        new IScroll("#categroy-cnt", {
            mouseWheel: true,
            click: true
        });
        new IScroll("#categroy-rgt", {
            mouseWheel: true,
            click: true
        })
    })
</script>
